<template>
  <div class="divWarehouseAdd">
    <div class="divForm">
      <el-form ref="form" :model="formDate" :rules="rules">
        <el-row class="row1">
          <el-col class="span1" :span="6">
            <el-form-item prop="code" class="formitem1"  label="货品编码">
              <el-input v-model="formDate.code"  disabled placeholder="请输入"></el-input>
            </el-form-item>
          </el-col>
          <el-col class="span1" :span="6">
          <el-form-item prop="goodsTypeName" class="formitem1" label="货品类型">
              <el-input v-model="formDate.goodsTypeName"  suffix-icon="el-icon-search" placeholder="请输入内容"></el-input>
          </el-form-item>
          </el-col>
          <el-col class="span1" :span="6">
            <el-form-item prop="name" class="formitem1" label="货品名称">
              <el-input v-model="formDate.name" placeholder="请输入"></el-input>
            </el-form-item>
          </el-col>
          <el-col class="span1" :span="6">
          <el-form-item prop="barCode" class="formitem1" label="货品条码">
              <el-input v-model="formDate.barCode"   placeholder="请输入"></el-input>
          </el-form-item>
          </el-col>
          <el-col class="span1" :span="6">
          <el-form-item prop="ownerName" class="formitem1" label="货主">       
          <el-input v-model="formDate.ownerName" placeholder="请输入内容" suffix-icon="el-icon-search"></el-input>
          </el-form-item>
          </el-col>
          <el-col class="span1" :span="6">
          <el-form-item prop="inspectionType" class="formitem1" label="质检方式">
            <el-select v-model="formDate.inspectionType" placeholder="请选择" style="width: 100%;">
              <!-- <el-option
                v-for="item in useType"
                :key="item.useType"
                :label="item.value"
                :value="item.useType">
              </el-option> -->
            </el-select>
          </el-form-item>
          </el-col>
          <el-col class="span1" :span="6">
            <el-form-item prop="temperatureType" class="formitem1" label="温度要求">
              
               <el-select v-model="formDate.temperatureType" placeholder="请选择" style="width: 100%;">
              <!-- <el-option
                v-for="item in useType"
                :key="item.useType"
                :label="item.value"
                :value="item.useType">
              </el-option> -->
            </el-select>
            </el-form-item>
          </el-col>
          <el-col class="span1" :span="6">
            <el-form-item prop="bearingType" class="formitem1" label="承重要求">
               <el-select v-model="formDate.bearingType" placeholder="请选择" style="width: 100%;">
              <!-- <el-option
                v-for="item in useType"
                :key="item.useType"
                :label="item.value"
                :value="item.useType">
              </el-option> -->
            </el-select>
            </el-form-item>
          </el-col>
           <el-col class="span1" :span="6">
          <el-form-item prop="volume" class="formitem1" label="体积">
          
              <el-input v-model="formDate.volume" placeholder="请输入">
                <template slot="append">m³</template>
              </el-input>
          </el-form-item>
          </el-col>
          <el-col class="span1" :span="6">
          <el-form-item prop="useType" class="formitem1" label="指定库区">
            <el-select v-model="formDate.useType" placeholder="请选择" style="width: 100%;">
              <!-- <el-option
                v-for="item in useType"
                :key="item.useType"
                :label="item.value"
                :value="item.useType">
              </el-option> -->
            </el-select>
          </el-form-item>
          </el-col>
          <el-col class="span1" :span="6">
            <el-form-item prop="price" class="formitem1" label="单价">
              <el-input v-model="formDate.price" placeholder="请输入">
                <template slot="append">元</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col class="span1" :span="6">
            <el-form-item prop="unit" class="formitem1" label="单位">
          
              <el-select v-model="formDate.unit" placeholder="请选择" style="width: 100%;">
              <!-- <el-option
                v-for="item in useType"
                :key="item.useType"
                :label="item.value"
                :value="item.useType">
              </el-option> -->
            </el-select>
            </el-form-item>
          </el-col> 
           <el-col class="span1" :span="6">
            <el-form-item prop="guaranteeDay" class="formitem1" label="保质天数">
              <el-input v-model="formDate.guaranteeDay" placeholder="请输入">
                <template slot="append">天</template>
              </el-input>
            </el-form-item>
          </el-col>
         
        </el-row>
      </el-form>
      <div class="buttonBox">
      <button class="unimportanceButton" @click="$router.push('area')">返回</button>
      <button class="minorImportantButton" @click="submit">提交</button>
    </div>
    </div>
  </div>
</template>

<script>
import {getHp} from '@/api/huopin'
export default {
  data () {
    return {
      formDate:{
        code:'',
        goodsTypeName:'',
        name:'',
        barCode:'',
        ownerName:'',
        inspectionType:'',
        temperatureType:'',
        bearingType:'',
        volume:'',
        price:'',
        unit:'',
        guaranteeDay:''

      },
      rules:{
        code:[{required:true,trigger:'blur'}],
        goodsTypeName:[{required:true,trigger:'blur'}],
        name:[{required:true,message:'请输入货品名称',trigger:'blur'}],
        barCode:[{required:true,message:'请输入货品条码',trigger:'blur'}],
        ownerName:[{required:true,trigger:'blur'}],
        inspectionType:[{required:true,trigger:'blur'}],
        temperatureType:[{required:true,trigger:'blur'}],
        bearingType:[{required:true,trigger:'blur'}],
        volume:[{required:true,message:'请输入数字'}]

      }
    }
  },
  created(){
    this.getHp()
  },
  methods:{
    async getHp(){
      const {data:{data}}=await getHp()
      // console.log(data);
      this.formDate.code=data

    },
    submit(){

    }
  }

   
}
</script>

<style lang="less" scoped>
  .divWarehouseAdd {
    height: 369px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 0 6px 0 rgb(144 142 142 / 17%);
    margin-top: 20px;
    margin-left: 29px;
    margin-right: 29px;
    padding-top: 31px;
    padding-bottom: 30px;
    .divForm {
      padding-left: 30px;
      padding-right: 30px;
    }
  }
  .el-col{
  height: 100px;
  }
  
  ::v-deep .el-form {
        .row1 {
          margin-left: -15px;
          margin-right: -15px;
          .span1{
            padding-left: 15px;
            padding-right: 15px;
            .formitem1 {
              margin-bottom: 30px;
              .el-form-item__label {
                line-height: 18px;
                padding-bottom: 10px !important;
                padding-left: 5px !important;
                font-size: 12px !important;
                font-family: PingFangSC,PingFangSC-Medium;
                font-weight: 500;
                color: #887e7e;
                padding: 0 12px 0 0;
                box-sizing: border-box;
              }
              .el-cascader {
                width: 100%;
              }
              .el-radio-group {
                  width: 100% !important;
                  display: block;
                  flex: 1;
                  flex-basis: auto;
                  overflow: auto;
                  box-sizing: border-box;
                  padding-top: 13px;
                  padding-bottom: 13px;
                }
            }
          }
        }
      }
  .buttonBox{
    padding: 25px 0 0;
    margin: 0 -30px -5px;
    border-top: 1px solid #f5efee;
    text-align: center;
    .unimportanceButton{
      height: 40px;
      border-radius: 20px;
      border: 0;
      font-size: 14px;
      font-family: PingFangSC,PingFangSC-Medium;
      font-weight: 500;
      text-align: center;
      line-height: 40px;
      padding-left: 26px;
      padding-right: 26px;
      cursor: pointer;
      outline: 0;
      width: 170px;
      margin: 0 15px;
    }
    .minorImportantButton{
      background: #ffb200;
      color: #332929;
      height: 40px;
      border-radius: 20px;
      border: 0;
      font-size: 14px;
      font-family: PingFangSC,PingFangSC-Medium;
      font-weight: 500;
      text-align: center;
      line-height: 40px;
      padding-left: 26px;
      padding-right: 26px;
      cursor: pointer;
      outline: 0;
      width: 170px;
      margin: 0 15px;
    }
  }
</style>
